import React, { Component } from "react"
import { messages } from "share/common"
import AdvancedTable from "components/advanced-table"
import { Modal, Button, Badge, message } from 'antd'
import financeViewService from "./finance-view.service";

class LoanDownload extends Component {

  componentWillReceiveProps(nextProps) {
    if (nextProps.tabKey === 'download') {
      this.advancedTableRef.getList();
    }
  }

  state = {
    loading: {
      pdfLoading: [],
      downloadLoading: [],
      deleteLoading: []
    }
  };

  renderDesc = () => {
    return (
      <section>
        <div>1、{messages('finance-1.key476')/*单个批次中借款单数量过大易导致打印失败，因此系统默认：100条/批*/}</div>
        <div>
          <span>2、{messages('finance-1.key477')/*【生成PDF】等待时间可能较长,请*/}</span>
          <Button
            ghost
            type="link"
            onClick={() => this.advancedTableRef.getList()}
          >
            <span style={{textDecoration: 'underline'}}> {messages('finance-1.key478')/*刷新*/}</span>
          </Button>
          <span>{messages('finance-1.key479')/*查看【生成PDF】是否已完成，在生成PDF期间您仍然可进行其他页面的操作。*/}</span>
        </div>
      </section>
    );
  };

  getColumns = loading => {
    return [{
      title: messages('finance-1.key480')/*批次号*/, dataIndex: 'loanBillBatchId'
    }, {
      title: messages('finance-1.key481')/*借款单数量*/, dataIndex: 'actualBatchSize', width: 120
    }, {
      title: messages('finance-1.key482')/*创建人工号*/, dataIndex: 'employeeID'
    }, {
      title: messages('finance-1.key483')/*创建人姓名*/, dataIndex: 'fullName'
    }, {
      title: messages('common.column.status')/*状态*/, dataIndex: 'status', width: 120,
      render: value => {
        switch(value) {
          case 0:
            return <Badge status="default" text={messages('finance-1.key484')/*未生成*/} />;
          case 1:
            return <Badge status="processing" text={messages('finance-1.key485')/*生成中*/} />;
          case 2:
            return <Badge status="success" text={messages('finance-1.key486')/*已生成*/} />;
          case 3:
            return <Badge status="error" text={messages('finance-1.key487')/*生成失败*/} />;
        }
      }
    }, {
      title: messages('common.operation')/*操作*/, dataIndex: 'id', width: 300,
      render: (value, record) => {
        return (
          <div>
            <Button
              type="primary"
              style={{marginRight: '10px'}}
              disabled={record.status === 1 || loading.pdfLoading.indexOf(record.loanBillBatchId) > -1}
              onClick={() => this.generatePDF(record.loanBillBatchId)}
            >
              {record.status === 1 || loading.pdfLoading.indexOf(record.loanBillBatchId) > -1
                ? messages('finance-1.key485')/*生成中*/
                : messages('finance-1.key488')/*生成PDF*/}
            </Button>
            <Button
              style={{marginRight: '10px'}}
              disabled={record.status !== 2}
              loading={loading.downloadLoading.indexOf(record.loanBillBatchId) > -1}
              onClick={() => this.downloadBatch(record.loanBillBatchId)}
            >
              {messages('finance-1.key489')/*下载*/}
            </Button>
            <Button
              loading={loading.deleteLoading.indexOf(record.loanBillBatchId) > -1}
              disabled={record.status === 1}
              onClick={() => {
                Modal.confirm({
                  title: messages('finance-1.key490')/*确认删除？*/,
                  content: messages('finance-1.key491')/*删除批次内的借款单可重新生成批次！*/,
                  onOk: () => this.handleDeleteBatch(record.loanBillBatchId),
                })
              }}>
              {messages('common.delete')/*删除*/}
            </Button>
          </div>
        )
      }
    }]
  };

  handleGetData = data => {
    data && data.map(item => {
      item.status !== 1 && this.setBtnLoading(item.loanBillBatchId, 'pdfLoading', false);
    })
  };

  setBtnLoading = (id, type, isLoading) => {
    const { loading } = this.state;
    loading[type][isLoading ? 'push' : 'delete'](id);
    this.setState({ loading });
  };

  generatePDF = id => {
    this.setBtnLoading(id, 'pdfLoading', true);
    financeViewService.generatePDF(id).then(() => {
      this.advancedTableRef.getList();
    }).catch(() => {
      this.setBtnLoading(id, 'pdfLoading', false)
    })
  };

  service = (page, size) => financeViewService.getBatchList({ page, size });

  downloadBatch = id => {
    this.setBtnLoading(id, 'downloadLoading', true);
    financeViewService.downloadBatch(id).then(res => {
      this.setBtnLoading(id, 'downloadLoading', false);
      window.open(res.data.fileURL)
    }).catch(() => {
      this.setBtnLoading(id, 'downloadLoading', false)
    })
  };

  handleDeleteBatch = id => {
    this.setBtnLoading(id, 'deleteLoading', true);
    financeViewService.deleteBatch(id).then(() => {
      message.success(messages('common.delete.success',{arg1: ""})/*{arg1} 删除成功*/);
      this.setBtnLoading(id, 'deleteLoading', false);
      this.advancedTableRef.getList();
    }).catch(() => {
      this.setBtnLoading(id, 'deleteLoading', false)
    })
  };

  render() {
    const { loading } = this.state;
    return (
      <div style={{ height: '100%' }}>
        <AdvancedTable.SimpleTable
          index
          columns={this.getColumns(loading)}
          onRef={ref => this.advancedTableRef = ref}
          service={this.service}
          rowKey="id"
          onGetData={this.handleGetData}
        >
          <div style={{display: 'flex', margin: '0 20px'}}>
            <div>
              {messages('finance-1.key492')/*说明*/}：
            </div>
            <div>
              {this.renderDesc()}
            </div>
          </div>
        </AdvancedTable.SimpleTable>
      </div>
    );
  }

}

export default LoanDownload
